import 'package:flutter/material.dart';
import '../services/ScreenAdapter.dart';
import 'package:flutter/rendering.dart';


/*
搜索框
 */

class SearchPage extends StatefulWidget {
  SearchPage({Key key}) : super(key: key);

  _SearchPageState createState() => _SearchPageState();
}

class _SearchPageState extends State<SearchPage> {
  @override
  Widget build(BuildContext context) {
    ScreenAdapter.init(context);
    return Scaffold(
      appBar: AppBar(
        title: Container(
          height: ScreenAdapter.height(68),
          decoration: BoxDecoration(
            color: Color.fromRGBO(233, 233, 233, 0.8),
            borderRadius: BorderRadius.circular(30.0),
          ),
          padding: EdgeInsets.only(left: 8),
          //放一个输入框
          child: Container(
            margin: EdgeInsets.only(bottom: 8),
            child: TextField(
              autocorrect: true, //让键盘自动弹出
              decoration: InputDecoration(
                  border: OutlineInputBorder(
                borderRadius:
                    BorderRadius.circular(30), //设置输入框的边缘为原型，也可不用设置,便于美观
                borderSide: BorderSide.none, //取消输入框的下划线
              )),
            ),
          ),
        ),
        actions: [
          InkWell(
            child: Container(
              height: ScreenAdapter.height(68),
              width: ScreenAdapter.width(80),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    '搜索',
                    style: TextStyle(fontSize: ScreenAdapter.size(28.0)),
                  )
                ],
              ),
            ),
            onTap: () {},
          )
        ],
      ),
      body: Container(
        padding: EdgeInsets.all(ScreenAdapter.height(15)),
        child: ListView(
          children: [
            Container(
              child: Text(
                '热搜',
                 style: TextStyle(fontSize: ScreenAdapter.size(32.0)),
              ),
            ),
            Divider(),
            Wrap(
              children: <Widget>[
                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                    color: Color.fromRGBO(233, 233, 233, 1),
                    borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('连衣裙'),
                ),

                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('裤子'),
                ),

                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('笔记本512g'),
                ),


                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('在线教育视频 老师老师'),
                ),

                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('笔记本512g'),
                ),


                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('笔记本512g'),
                ),

                Container(
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  margin: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: BoxDecoration(
                      color: Color.fromRGBO(233, 233, 233, 1),
                      borderRadius: BorderRadius.circular(10)
                  ),
                  child: Text('笔记本512g'),
                ),

              ],
            ),


            SizedBox(height: ScreenAdapter.height(60),),
            Container(
              child: Text(
                '搜索记录',
                style: TextStyle(fontSize: ScreenAdapter.size(32.0)),
              ),
            ),
            Divider(),
            Column(
              children: <Widget>[
                ListTile(
                  title: Text("女装"),
                ),
                Divider(),
                ListTile(
                  title: Text("女装"),
                ),
                Divider(),
                ListTile(
                  title: Text("男装"),
                ),
                Divider(),
                ListTile(
                  title: Text("手机"),
                ),
                Divider(),
                ListTile(
                  title: Text("鞋子"),
                ),
                Divider(),
              ],
            ),

            SizedBox(height: ScreenAdapter.height(100)),
            InkWell(
              onTap: (){

              },
              child: Container(
                width: ScreenAdapter.width(400),
                height: ScreenAdapter.height(64),
                decoration: BoxDecoration(
                    border: Border.all(color: Colors.black45, width: 1)),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[Icon(Icons.delete), Text("  清空历史记录")],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}